<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>购物车</title>
		<link rel="stylesheet" type="text/css" href="./Public/Home/css/shopping.css"/>
		<link rel="stylesheet" type="text/css" href="./Public/Home/css/common.css"/>
		<script type="text/javascript" src="./Public/Home/js/jquery-1.7.2.min.js"></script>
		<script type="text/javascript" src="./Public/Home/js/land.js"></script>
		<script type="text/javascript">
			{$(function(){
				
				$('.jia').click(function(){
//					js控制input框中的加
					var num = parseInt($(this).siblings('.n').val())+1;
					$(this).siblings('.n').val(num);
//					获得input里的value值
					var value = $(this).siblings('.n').val();
//					alert(value);
//					获得商品下标（names为自定义属性）
					var names = $(this).siblings('.n').attr('names');
					
					var jia = this;
					$.ajax({
						type:"post",
						url:"{{U('./Home/Shopping/pri')}}",
						data:{names:names,value:value},
						dataType:"json",
						success:function(data){
//							获得单个商品的总价格
							var pri = data.pri;
//							获得所有商品的总数量
							var nums = data.nums;
//							获得所有商品的总价格
							var price = data.price;
//							定义空数组
							var all = '';
//							组合字符串
							var str = '<li>商品总数：';
							str += nums + ' 件</li>';
							str += '<li>商品总价：' + price + ' 元</li>';
							str += '<li>优惠节省：0 元</li>';
							str += '<li>合计：<span>' + price + ' 元</span></li>';
							all += str;
//							执行替换
							$('#price').html(all);
//							把单个商品的总价格替换
							$(jia).parents('.goods').find('.price').html('<span class="price">' +pri+ '</span>');
						}
					})
				})
				
				$('.jian').click(function(){
					var num = parseInt($(this).siblings('.n').val())-1;
					if(!num){
						return;
					}
					$(this).siblings('.n').val(num);
					
					
					var names = $(this).siblings('.n').attr('names');

					var value = $(this).siblings('.n').val();
					
					var jian = this;
					
					$.ajax({
						type:"post",
						url:"{{U('./Home/Shopping/pri')}}",
						data:{names:names,value:value},
						dataType:"json",
						success:function(data){
							var pri = data.pri;
							var nums = data.nums;
							var price = data.price;
							var all = '';
							
							var str = '<li>商品总数：';
							str += nums + ' 件</li>';
							str += '<li>商品总价：' + price + ' 元</li>';
							str += '<li>优惠节省：0 元</li>';
							str += '<li>合计：<span>' + price + ' 元</span></li>';
							all += str;
							
							$('#price').html(all);
							$(jian).parents('.goods').find('.price').html('<span class="price">' +pri+ '</span>');
						}
					})
				})
				
				$('.xg').click(function(){
					if(confirm('确定要删除吗？')){
						$(this).parent().remove();
						var names = $(this).attr('names');
//						alert(names);
						$.ajax({
							type:'post',
							url:"{{U('./Home/Shopping/del')}}",
							data:{names:names},
							dataType:"json",
							success:function(data){
								var nums = data.nums;
								var price = data.price;
								var all = '';
								
								var str = '<li>商品总数：';
								str += nums + ' 件</li>';
								str += '<li>商品总价：' + price + ' 元</li>';
								str += '<li>优惠节省：0 元</li>';
								str += '<li>合计：<span>' + price + ' 元</span></li>';
								all += str;
								$('#price').html(all);
							}
						})
					}
				})
				
				$('.username').click(function(){
					if($(this).attr('username') == 0){
						$('.outlogin-box').fadeIn();
						$(this).attr('username','1');
					}else{
						$('.outlogin-box').fadeOut();
						$(this).attr('username','0');
					}
				})
				
//				$('.p').click(function(){
//					$('.p').addClass('p2');
//					$('.p1').addClass('p2');				
//				})
//				
//				$('.p1').click(function(){
//					if($(this).attr("switch") == 0){
//						$(this).addClass('p2');
////						alert($('.foods').length);
//						if(!$('.p1').length){
//							$('.p').addClass('p2');
//						}
//						$(this).attr("switch","1");
//					}else{
//						$(this).removeClass('p2');
//						$('.p').removeClass('p2');
//						$(this).attr("switch","0");
//					}
//					
//				})
			})}
		</script>
	</head>
	<body>
		{{include file="../Common/login"}}
		<!--头部-->
		<div class="top-box">
			<div class="top">
				<div class="top-left">
				</div>
				<div class="top-right">
					<ul class="right-ul">
						{{if value="isset($_SESSION['username'])"}}
						<li><a href="javascript:;" class="order">我的订单</a></li>
						<li>
							<a href="javascript:;" class="username" username="0">{{$_SESSION['username']}}</a> | 
							<div class="outlogin-box"><a href="{{U('Login/out')}}">退出登录</a></div>
						</li>
						{{else}}
						<li><a href="javascript:;" class="zhuc">注册</a></li>
						<li><a href="javascript:;" class="dengl">登录</a> | </li>
						{{endif}}
						<li><a href="{{U('Index/index')}}">返回首页</a> | </li>
					</ul>
				</div>
			</div>
		</div>
		<!--索引-->
		<div class="logo">
			<div class="logo-left">
				<a href=""><div></div></a>
			</div>
			<div class="logo-right">
				<img src="./Public/Home/images/process1.jpg" alt="" />
			</div>
		</div>
		<!--结算-->
		<div class="jiesuan">
			<div class="jieTop">
				<t>
					<a href="javascript:;"><p class="p"></p></a>
					<label for="xuan">全选</label>
					<d>商品</d>
				</t>
				<b>规格</b>
				<b>单价</b>
				<b>数量</b>
				<b>金额</b>
				<b>操作</b>
			</div>
			<div class="jieCenter">
				{{foreach from="$data" key="$k" value="$v"}}
				<div class="goods">
					<a href="javascript:;" class="img"><p class="p1" switch="0"></p></a>
					<a href="" class="fImg"><img src="./Public/Home/images/m.jpg" alt="" style="width: 115px;"/></a>
					<div class="foodsName">
						<a href="">{{$v['name']}}</a>
						<br />
						<a href=""><img src="./Public/Home/images/fuwu.jpg" alt="" />购买联想服务</a>
					</div>
					<div class="guige">
						{{foreach from="$v['options']" key="$key" value="$value"}}
						<span>{{$key}}：{{$value}}</span>&nbsp;&nbsp;
						{{endforeach}}
					</div>
					<div class="pri"><span>{{$v['price']}}</span></div>
					<div class="num">
						<input type="button" value="-" id="" class="j jian"/>
						<input type="text" name="" readonly="" value="{{$v['num']}}" names="{{$k}}" class="numBox n"/>
						<input type="button" value="+" id="" class="j jia"/>
					</div>
					<div class="pri" style="color: #E2231A;"><span class="price">{{$v['total']}}</span></div>
					<a href="javascript:;" names="{{$k}}" class="xg"><b></b></a>
				</div>
				{{endforeach}}
			</div>
			<div class="jieBottom">
				<t>
					<a href="javascript:;"><p class="p"></p></a>
					<label for="xuan">全选</label>
					<a href="{{U('Home/Shopping/emptycart')}}" class="emptycart">清空购物车</a>
				</t>
				<ul id="price">
					<li>商品总数：{{$num}} 件</li>
					<li>商品总价：{{$price}} 元</li>
					<li>优惠节省：0 元</li>
					<li>合计：<span>{{$price}} 元</span></li>
				</ul>
			</div>
			<div class="jieSuan">
				<a href="{{U('Clear/index')}}">去结算</a>
			</div>
		</div>
		{{include file="../Common/foot"}}
	</body>
</html>
